<template>
	<view style="padding: 10px;">
		<uni-forms ref="form" :rules="{}" label-width="70px">
			<view v-for="(item,index) in entity.MediumList" :key="index">
				<view v-if="item.Mtype==='audio'">
					<eliseAudio audioId="audio1" :url="item.Murl" audioColor="#68d7bb" :durationS="item.duration"
						ref="eliseAudio" v-if="item.Mtype==='audio'" style="margin-bottom: 10px;"></eliseAudio>

					<uni-icons type="trash" v-if="item.Mtype==='audio'" @click="imgDel(index)" class="color" size="20"
						color="red"></uni-icons>
				</view>
			</view>
			<uni-grid :column="3" :showBorder="false">
				<view v-for="(item,index) in entity.MediumList" :key="index">
					<uni-grid-item v-if="item.Mtype==='image'||item.Mtype==='video'">
						<image :src="item.Murl" style="width: 100%;height: 100%;"
							@click="lookimg(entity.MediumList,index)" v-if="item.Mtype==='image'"></image>
						<view v-if="item.Mtype==='video'" @click="lookimg(entity.MediumList,index)">
							<uni-icons type="videocam-filled" size="30" color="#fff"></uni-icons>
						</view>
					</uni-grid-item>
				</view>
			</uni-grid>
			<uni-forms-item v-for="item in entity.PropData" :key="item.ControlKey" :label="item.ControlName"
				:name="item.ControlKey">
				{{entity[item.ControlKey]||''}}
			</uni-forms-item>
			<uni-forms-item label="描述内容" name="" style="position: relative;">
				{{entity.Content}}
			</uni-forms-item>
		</uni-forms>
		<ImageView ref="ImageView"></ImageView>
	</view>
</template>

<script>
	import ImageView from '@/components/ImageView.vue'
	export default {
		components: {
			ImageView,
		},
		data() {
			return {
				entity: {},
				type: 1,
				index: 0,
				TaskId: '',
				ProjectId: '',
			}
		},
		onLoad(options) {
			this.entity = JSON.parse(options.data)
			this.entity.PropData.forEach(item => {
				this.$set(this.entity, item.ControlKey, item.DefaultValue)
			})
			console.log(this.entity);
		},
		methods: {

			// 查看图片
			lookimg(path, index) {
				this.$refs.ImageView.open(path, this.entity.Content, index)
			},
		}
	}
</script>

<style scoped>
.uni-forms-item{
	align-items: center;
}
</style>